<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Oracle
  Date: 2022/4/14
  Time: 19:06
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <link rel="icon" type="images/x-icon" href="/static/image/b.png"/>
    <title>开启武器箱</title>
</head>

<style>
    body {
        background-image: url(/static/image/index-section2-bg.jpg);
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed;
        margin: 0;
        padding: 0;
    }
    .bigBox {
        width: auto;
        height: auto;
    }

    .top {
        width: 100%;
        height: 71px;
        border-bottom: 1px solid gray;
    }

    .center {
        width: 60vw;
        height: 80vh;
        border: 1px solid gray;
        margin: 36px auto 0px;
        padding-top: 20px;
    }
    .boxList p{
        text-align: center;
        color: white;
        font-size: 23px;
    }
    .boxList a{
        text-decoration: none;
        color: white;
    }

    .gunBox {
        width: 150px;
        height: 160px;
        text-align: center;
        margin: 5px 0 0 30px;
        float: left;
        background: #ffffff10;
    }
    .gunBox:hover{
        background: #ffffff10;
    }

</style>

<body>


<div class="bigBox">

    <!-- 页面头部内容 -->
    <div class="top">
        <iframe src="${pageContext.request.contextPath }/goods/head" scrolling="no" width="100%" height="71px" frameborder="0" name="show"></iframe>
    </div>

    <!-- 页面中间内容 -->
    <div class="center">

        <div class="boxList" id="boxList">
            <p>可开启的箱子</p>

            <c:forEach items="${requestScope.boxList}" var="box">
                <a href="${pageContext.request.contextPath}/goods/getBox/${box.id}">
                    <div class="gunBox">
                        <img src="${box.boxImg}" width="140px" height="125x" />
                        <font>${box.boxName}</font>
                    </div>
                </a>
            </c:forEach>
        </div>
    </div>
    <%--页面尾部--%>
    <div class="tail">
        <iframe src="${pageContext.request.contextPath }/goods/tail" scrolling="no" width="100%" height="324px" frameborder="0" ></iframe>
    </div>

</div>

</body>
</html>

